<template>
  <component :is="viewName"></component>
</template>

<script>
import HomeView from "./views/HomeView.vue";
import LoginView from "./views/LoginView.vue";

export default {
  data() {
     return {
        viewName: "HomeView" ,
     }
  },
  components: {
    HomeView ,
    LoginView
  },
  watch : {
    $route: function(route) {
      if (route.path === "/login") {
         this.viewName = "LoginView" ;
      }else{
         this.viewName = "HomeView" ;
      }
    }
  }
}

</script>


<style>
* {
  margin: 0;
  padding: 0;
}

::-webkit-scrollbar {
  width:5px;
}
::-webkit-scrollbar-track {
  background:#f2f2f2;
}
::-webkit-scrollbar-thumb {
  background:rgba(0,0,0,.2);
}
::-webkit-scrollbar-thumb:hover {
  background:#f2f2f2;
}
::-webkit-scrollbar-thumb:active {
  background:rgba(0,0,0,0.2);
}
</style>
